<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<meta charset="UTF-8" />
	<title>泡泡IM</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-touch-fullscreen" content="yes">
	<meta name="generator" content="generator_to_replace">
	<link rel="shortcut icon" href="/static/favicon.ico" />
	<meta http-equiv="Access-Control-Allow-Origin" content="*">
	<link rel="stylesheet" href="/static/h5/css/h5.css?v=1.1.80" />
</head>
<body>
	<!-- 欢迎画面 -->
	<div class="pop__panel pop__clearfix pop__welcome" id="welcome" v-show="im.show=='welcome'">
		<div class="pop__main-page pop__flexbox">
			<div class="pop__center">
				<img src="/static/h5/img/logo.jpg">
			</div>
		</div>
	</div>

	<!-- IM主容器 -->
	<div class="pop__panel pop__clearfix">
		<div class="pop__main-page pop__flexbox" id="home" v-show="im.show=='home'">
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<em class="pop__placeholder"></em>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{im.setting.app_name}}</h2>
					<em v-if="im.setting.qrcode_scan=='on'||im.setting.add_friend=='on'||im.setting.create_group=='on'" class="pop__placeholder" @click="toggleTopBar"><i class="pop__icon">&#xeb90;</i></em>
				</div>
			</div>

			<div class="pop__topbar-mask" style="display: none" @click="toggleTopBar"></div>
			<div class="pop__topbar-menu" style="display: none">
				<ul class="pop__clearfix">
					<li v-if="im.setting.create_group=='on'" class="pop__icon" :routeUrl="im.baseUri+'group/create'">&#xe609; {{$lang('发起群聊')}}</li>
					<li v-if="im.setting.add_friend=='on'" class="pop__icon" :routeUrl="im.baseUri+'friend/search'">&#xebb5; {{$lang('添加朋友')}}</li>
					<li v-if="im.setting.qrcode_scan=='on'" class="pop__icon" :routeUrl="im.baseUri+'qrcode/scan'">&#xeba2; {{$lang('扫一扫')}}</li>
				</ul>
			</div>

			<!-- //IM主页-->
			<div class="pop__body" v-show="tab=='chatting'">
				<div class="pop__scrolling-panel">
					<div class="pop__chatting-list">
						<div class="pop__warning-tip" v-show="stateName" @click="refresh">
							<i class="pop__loading" v-show="im.networkState=='connecting'"></i>{{stateName}}
						</div>
						<div class="pop__tip" v-show="!chattingItems.length">
							{{$lang('没有消息')}}
						</div>
						<ul class="pop__clearfix">
							<template v-for="item in chattingItems">
								<li class="pop__flexbox pop__cell" :routeUrl="im.baseUri+item.type+'/chat/'+item.id" :key="item.type+''+item.id" @touchstart.capture="touchStart($event, item)" @touchmove.capture="touchMove($event, item)" @touchend.capture="touchEnd($event, item)" :style="{transform: 'translate3d(-'+(item.slideDistance||0)+'rem,0,0)'}">
									<div class="pop__avatar"><img :src="item.avatar"/><em class="pop__badge" v-if="item.unread_count!=0">{{item.unread_count}}</em></div>
									<div class="pop__chatting-info">
										<h2 class="pop__chatting-title pop__clamp1" v-html="item.name"></h2>
										<p class="pop__chatting-content pop__clamp1" v-html="lastMessage(item).content"></p>
									</div>
									<span class="pop__time" v-html="$formatTime(lastMessage(item).timestamp)" :value="lastMessage(item).timestamp"></span>
									<div class="pop__chatting-options pop__flexbox">
										<div class="pop__flexbox pop__chatting-top" @click.stop.capture="switchTop($event, item)">{{item.top ? $lang('取消置顶') : $lang('置顶')}}</div>
										<div class="pop__flexbox pop__chatting-delete" @click.stop.capture="deleteItem($event, item)">{{$lang('删除')}}</div>
									</div>
								</li>
							</template>
						</ul>
					</div>
				</div>

			</div>

			<!-- 通讯录-->
			<div class="pop__body" v-show="tab=='friend'">
				<div class="pop__scrolling-panel">
					<div class="pop__friend-list">
						<div class="pop__warning-tip" v-show="stateName" @click="refresh">
							{{stateName}}
						</div>
						<ul class="pop__clearfix">
							<li>
								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'friend/search'" v-show="im.setting.add_friend=='on'">
									<img class="pop__avatar-small" src="/static/h5/img/icon__add-friend.png" /><span class="pop__flex1">{{$lang('新的好友')}}</span><label><em class="pop__badge" v-if="unreadApplyCount!=0">{{unreadApplyCount}}</em></label>
								</div>
								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'group/list'">
									<img class="pop__avatar-small" src="/static/h5/img/icon__groups.png" /><span class="pop__flex1">{{$lang('群聊')}}</span>
								</div>
								<template v-for="(items,key) in im.friend">
									<h2 class="pop__friend-list-letter pop__border-top" :class="'pop__firend_list_'+(key||'other')">{{key||'#'}}</h2>
									<template v-for="item in items">
									<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" :uid="item.uid" :routeURL="im.baseUri+'user/detail/'+item.uid">
										<img class="pop__avatar-small" :src="item.avatar"><span class="pop__flex1" v-html="item.remark || item.name"></span>
									</div>
									</template>
								</template>
							</li>
						</ul>

						<i v-show="im.dataLoading" class="pop__loading"></i>

					</div>
				</div>
				<!-- //字母显示 -->
				<div class="pop__friend-list-showletter">A</div>
				<!-- //26字母 -->
				<div class="pop__friend-list-floatletter">
					<em v-for="char in ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','#']" @click="scrollIntoView(char)">{{char}}</em>
				</div>
			</div>
			<!-- 探索-->
			<div class="pop__body" v-show="tab=='explore'">
				<div class="pop__scrolling-panel">
					<iframe :src="explore_url" width="100%" height="100%" style="border: none">
					</iframe>
				</div>
			</div>
			<!-- 我-->
			<div class="pop__body" v-show="tab=='mine'">
				<div class="pop__scrolling-panel">
					<div class="pop__mine-info-list">
						<div class="pop__warning-tip" v-show="stateName" @click="refresh">
							{{stateName}}
						</div>
						<ul class="pop__clearfix">
							<li>
								<div class="pop__mine-info-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'mine/detail'">
									<img class="pop__avatar" :src="im.mine.avatar" />
									<span class="pop__name pop__flex1">
										<em v-html="im.mine.nickname"></em><i v-html="im.setting.app_name+$lang('号')+'：'+im.mine.username"></i>
									</span>

									<div class="pop__arr pop__icon">{{im.setting.qrcode_friend=='on'?'&#xeba0;':''}}</div>
								</div>
							</li>

							<li>
								<div class="pop__mine-info-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'setting/others'">
									<div class="pop__icon">&#xeba3;</div><span class="pop__flex1">{{$lang('设置')}}</span><div class="pop__arr"></div>
								</div>
							</li>
						</ul>
					</div>
				</div>
			</div>

			<!-- //底部footer -->
			<div class="pop__footer">
				<div class="pop__footer-wrapper pop__border-top">
					<ul class="pop__flexbox pop__flex-align-center">

						<li class="pop__flex1" :class="{'pop__icon-selected':tab=='chatting'}" @click="tab='chatting'"><i class="pop__ico layui-icon pop__icon-chatting">&#xe611;<template v-if="unreadMessageCount!=0"><em class="pop__badge">{{unreadMessageCount}}</em></template></i><span>{{$lang('消息')}}</span></li>

						<li class="pop__flex1" :class="{'pop__icon-selected':tab=='friend'}" @click="tab='friend'"><i class="pop__ico layui-icon pop__icon-friends">&#xe613;<template v-if="unreadApplyCount!=0"><em class="pop__badge">{{unreadApplyCount}}</em></template></i><span>{{$lang('联系人')}}</span></li>

						<li v-if="im.setting.explore_url" class="pop__flex1" :class="{'pop__icon-selected':tab=='explore'}" @click="tab='explore'"><i class="pop__ico layui-icon pop__icon-explore">&#xe670;<em class="pop__badge pop__badge-dot"></em></i><span>{{$lang('探索')}}</span></li>

						<li class="pop__flex1" :class="{'pop__icon-selected':tab=='mine'}" @click="tab='mine'"><i class="pop__ico layui-icon pop__icon-mine">&#xe612;</i><span>{{$lang('我')}}</span></li>

					</ul>
				</div>
			</div>
		</div>
	</div>

	<!-- 聊天容器 -->
	<div class="pop__panel pop__clearfix" id="chat" style="display:none" v-show="im.show=='chat'" @touchstart="touchStart">
		<audio id="chat-message-audio">
			<source id="chat-message-audio-source" src="/static/h5/sound/default.mp3" type="audio/mpeg" />
		</audio>
		<div class="pop__chat-wrapper pop__flexbox">
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1 pop__clamp1" v-html="name"></h2>
					<a class="pop__dot-more" :href="im.baseUri+(type=='group'?type:'user')+'/detail/'+id"></a>
				</div>

				<div class="pop__group-notice-tip pop__ellipsis" v-show="notice.content && 1!=notice.readed" @click="showNotice=1" v-html="$lang('公告')+'：'+notice.content"></div>

				<div class="pop__group-notice-box" v-show="showNotice">
					<div v-html="nl2brNotice" class="pop__group-notice-content">
					</div>
					<div class="pop__flexbox pop__flex-justify-center pop__margin-top">
						<a class="pop__btn-primary" @click="noticeReaded">{{$lang('我知道了')}}</a>
					</div>
				</div>
			</div>
			<!-- //IM消息上墙面板 -->
			<div class="pop__chat-msg-panel pop__flex1" @scroll.passive="handleScroll">
				<div class="pop__chat-content">
					<ul class="pop__clearfix" @click="closePanel">
						<li class="pop__chat-msg-notice" v-show="messageLock && !messageEnd"><span><i class="pop__loading"></i>{{$lang('加载中...')}}</span></li>
						<li class="pop__chat-msg-notice" v-show="messageEnd"><span>{{$lang('没有更多数据了')}}</span></li>
						<template v-for="item in messageList">
							<li v-if="needInsertTime(item.timestamp)" class="pop__chat-msg-time"><span>{{$date(item.timestamp)}}</span></li>
							<chat-message
								:type="type"
								:from="item.from"
								:name="item.name"
								:content="item.content"
								:avatar="item.avatar"
								:mid="item.mid"
								:sub_type="item.sub_type"
								:timestamp="item.timestamp"
								:im="im"
							>
							</chat-message>
						</template>

						<!-- 长按提示 -->
						<div class="pop__chat-tap-menu" :style="{left:tapMenuLeft, top:tapMenuTop}" v-show="tapMenuShow&&(supportCopy||supportRevoke)" ref="menu">
							<div class="pop__menu">
								<a href="javascript:void(0);" @click="copy" v-show="supportCopy"><i class="pop__icon-copy"></i>{{$lang('复制')}}</a>
								<a href="javascript:void(0);" @click="revoke" v-show="supportRevoke"><i class="pop__icon-revoke"></i>{{$lang('撤回')}}</a>
							</div>
						</div>

						<!-- 录音提示 -->
						<div class="pop__chat-voice-tip" v-show="voiceTips&&voice" @click="cancelVoice">
							<div class="pop__line-scale-pulse-out" v-show="voiceTips==$lang('手指上划，取消发送')">
								<div></div>
								<div></div>
								<div></div>
								<div></div>
								<div></div>
							</div>
							<div class="pop__cross" v-show="voiceTips==$lang('松开手指，取消发送')"></div>
							<div :class="{pop__warning:voiceTips==$lang('松开手指，取消发送')}">{{voiceTips}}</div>
						</div>

					</ul>
				</div>
			</div>

			<!-- //IM底部功能面板 -->
			<div class="pop__chat-tool-panel">
				<div class="pop__chat-at-tip" v-show="atContent.mid">
					<span v-html="atContent.from_name+': '+atContent.content"></span><i class="pop__icon pop__gray" @click="closeAtContentTip">&#xebb4;</i>
				</div>
				<!-- 输入框模块 -->
				<div class="pop__editor-panel pop__border-top pop__flexbox">
					<i v-show="!voice && im.setting.voice=='on'" class="pop__btn pop__btn-voice" @click.prevent="toggleVoice"></i>
					<i v-show="voice && im.setting.voice=='on'" class="pop__btn pop__btn-keyboard" @click.prevent="toggleVoice"></i>
					<textarea v-show="!voice" class="pop__chat-tool-editor pop__user-select" v-model="message" @focus="scrollBottom" ref="input" :style="{width:inputWidth}" @blur="resizeWindow" @paste="paste"></textarea>
					<input v-show="voice" class="pop__chat-tool-editor pop__none-user-select" type="button" @touchstart.prevent="beginVoiceRecord" @touchend="sendVoice" @touchmove.prevent="cancelVoice" :class="{'pop__chat-tool-pressing':voiceTips}" :value="voiceBtnTips" :style="{width:inputWidth}" @contextmenu.prevent.self />
					<i class="pop__btn pop__btn-emotion" @click.prevent="openEmotion" v-show="im.setting.emoji=='on'"></i>
					<i :style="{visibility:!message}" class="pop__btn pop__btn-choose" @click.prevent="openFunction"></i>
					<button v-if="message!=''" class="pop__btn-submit" @click="send">{{$lang('发送')}}</button>
				</div>

				<!-- 表情、选择模块 -->
				<div class="pop__choose-panel pop__border-top" v-show="panel=='face'||panel=='function'">
					<!-- 表情区域 -->
					<div class="pop__emotion-wrapper" v-show="panel=='face'">
						<div class="pop__emotion__cells pop__flexbox">
							<div class="pop__emotion__cells-swiper pop__flex1">
								<div class="swiper-container" id="pop__emotion" @click="selectEmotion">
									<div class="swiper-wrapper">
										<div  v-for="(items, index) in emojiList()" :key="index" class="swiper-slide">
											<div class="pop__face-list">
											<span v-for="(item, index) in items" :key="index" class="pop__emoji" @click="message+=item">
												{{item}}
											</span>
											</div>
										</div>
									</div>
									<div class="pop__emotion-pagination"></div>
								</div>
							</div>
						</div>
					</div>
					<!-- 选择区域 -->
					<div class="pop__choose-wrapper" v-show="panel=='function'">
						<ul class="pop__clearfix">
							<li v-show="im.setting.upload_img=='on'"><a href="javascript:;"><span class="pop__avatar"><i class="layui-icon layui-icon-image">&#xe60d;</i><form><input type="file" accept="image/*" @change="uploadImage" /></form></span><em>{{$lang('照片')}}</em></a></li>
							<li v-show="im.setting.upload_file=='on'"><a href="javascript:;"><span class="pop__avatar"><i class="layui-icon">&#xe621;</i><form><input type="file" accept="*" @change="uploadFile"/></form></span><em>{{$lang('文件')}}</em></a></li>

						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>


	<!-- 所有群组 -->
	<div class="pop__panel pop__clearfix" id="group_list" v-show="im.show=='group_list'">
		<div class="pop__main-page pop__flexbox">
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('所有群聊')}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>

			<div class="pop__body">
				<div class="pop__scrolling-panel">
					<div class="pop__friend-list">
						<ul class="pop__clearfix">
							<li>
								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'group/create'" v-show="im.setting.create_group=='on'">
									<img class="pop__avatar-small" src="/static/h5/img/icon__create-group.png" /><span class="pop__flex1">{{$lang('创建群聊')}}</span>
								</div>
								<h2></h2>
								<template v-for="item in im.group">
									<div class="pop__row pop__flexbox pop__flex-align-center pop__cell"  :routeURL="im.baseUri+'group/chat/'+item.gid">
										<img class="pop__avatar-small" :src="item.avatar"><span class="pop__flex1" v-html="item.remark || item.name"></span>
									</div>
								</template>
							</li>
						</ul>
					</div>
				</div>
			</div>

		</div>
	</div>

	<!-- 图片预览弹窗 -->
	<div class="pop__img-view" style="display: none;">
		<div class="swiper-container pop__img-view-container">
			<div class="swiper-wrapper"></div>
		</div>
	</div>

	<!-- 视频播放 -->
	<div class="pop__video-view" style="display: none;">
		<i class="pop__close"></i>
		<video id="pop__video" width="100%" height="100%" controls="controls" x5-video-player-type="h5" x5-video-player-fullscreen="true" webkit-playsinline preload="auto"></video>
	</div>

	<!-- 用户信息详情 -->
	<div class="pop__panel pop__clearfix" id="user_detail" style="display: none;" v-show="im.show=='user_detail'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('详细资料')}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>

			<!-- //好友详细资料页 -->
			<div class="pop__detail-panel">
				<ul class="pop__clearfix">
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell">
							<img class="pop__avatar" :src="avatar" />
							<label class="pop__detail-item-left pop__flex1">
								<em v-html="remarkname||nickname"></em><i v-show="remarkname" v-html="nickname"></i><i v-html="username"></i>
							</label>
						</div>
					</li>
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell">
							<span class="pop__detail-item-left">{{$lang('个性签名')}}</span>
							<span class="pop__flex1 section" v-html="sign"></span>
						</div>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" v-show="isFriend" style="display:none" :routeUrl="im.baseUri+'friend/remark/'+uid">
							<span class="pop__detail-item-left pop__flex1">
								{{$lang('设置备注')}}
							</span>
							<div class="pop__arr"></div>
						</div>
					</li>

					<li>
						<div v-if="gid&&gid_onwer!=uid" class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'group/forbidden/'+gid+'/'+uid">
							<span class="pop__detail-item-left pop__flex1">
								{{$lang('群内禁言')}}
							</span>
							<div class="pop__arr"></div>
						</div>
					</li>

					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" v-show="gid_onwer==im.mine.uid && uid!=im.mine.uid">
							<span class="pop__flex1">{{$lang('设为管理员')}}</span>
							<div class="pop__input-block">
								<input type="checkbox" v-model="is_manager">
								<div class="pop__unselect pop__form-switch" :class="{'pop__form-onswitch':is_manager==1}" @click="toggleManager()">
									<em>{{is_manager==1 ? 'ON' : 'OFF'}}</em><i></i>
								</div>
							</div>
						</div>
					</li>
				</ul>
			</div>
			<div class="pop__btns-panel">
				<a class="pop__btn-primary" v-show="accountState == 'normal' && uid && !isFriend && uid!=im.mine.uid && allowFriend" :href="im.baseUri+'friend/send_apply/'+uid">{{$lang('')}}发起好友申请</a>
				<a class="pop__btn-primary" href="javascript:;" v-show="accountState == 'normal' && isFriend" @click="chat">{{$lang('发起聊天')}}</a>
				<a class="pop__btn-warning" href="javascript:;" v-show="accountState == 'normal' && isFriend" @click="deleteFriend">{{$lang('删除好友')}}</a>
			</div>

		</div>
	</div>

	<!-- 我的信息详情 -->
	<div class="pop__panel pop__clearfix" id="mine_detail" style="display: none;" v-show="im.show=='mine_detail'">
		<div class="pop__main-page pop__flexbox">
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('个人信息')}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>

			<!-- //个人信息页 -->
			<div class="pop__detail-panel">
				<ul class="pop__clearfix">
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'setting/avatar'">
							<label class="pop__detail-item-left pop__flex1">{{$lang('头像')}}</label>
							<img class="pop__avatar" :src="im.mine.avatar" />
							<div class="pop__arr"></div>
						</div>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell">
							<label class="pop__detail-item-left pop__flex1">{{im.setting.app_name}}{{$lang('号')}}</label>
							<div class="pop__detail-item-right" v-html="im.mine.username"></div>
						</div>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'setting/nickname'">
							<label class="pop__detail-item-left pop__flex1">{{$lang('昵称')}}</label>
							<div class="pop__detail-item-right" v-html="im.mine.nickname"></div>
							<div class="pop__arr"></div>
						</div>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'setting/sign'">
							<label class="pop__detail-item-left pop__flex1">{{$lang('个性签名')}}</label>
							<div class="pop__detail-item-right" v-html="im.mine.sign"></div>
							<div class="pop__arr"></div>
						</div>
						<div v-if="im.setting.qrcode_friend=='on'" class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'setting/qrcode'">
							<label class="pop__detail-item-left pop__flex1">{{$lang('我的二维码')}}</label>
							<div class="pop__detail-item-right pop__icon" v-html="">&#xeba0;</div>
							<div class="pop__arr"></div>
						</div>

					</li>
				</ul>
			</div>

		</div>
	</div>

	<!-- 群组详情 -->
	<div class="pop__panel pop__clearfix" id="group_detail" style="display: none;" v-show="im.show=='group_detail'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('详细资料')}}x</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>

			<!-- //群详细资料页 -->
			<div class="pop__detail-panel">
				<ul class="pop__clearfix">
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-wrap pop__flex-align-center pop__cell">
							<template v-for="item in members">
								<div class="pop__avatar" :routeUrl="avatarLink(item.uid)"><img
										:src="item.avatar"/><span v-html="item.remark||item.nickname"></span></div>
							</template>
							<div class="pop__avatar" :routeUrl="im.baseUri+'group/memberadd/'+gid">
								<div class="pop__operation-adduser pop__operation-icon"></div>
							</div>
							<div class="pop__avatar" :routeUrl="im.baseUri+'group/memberdel/'+gid"
								 v-if="is_manager">
								<div class="pop__operation-deluser pop__operation-icon"></div>
							</div>
							<div class="pop__more-item pop__flex1 pop__flexbox pop__flex-align-center pop__flex-justify-center pop__cell"
								 :routeUrl="im.baseUri+'group/members/'+gid">
								<div class="pop__more">
									<span>
										{{$lang('查看更多群成员')}}
									</span>
									<span class="pop__arr"></span>
								</div>
							</div>
						</div>

					</li>
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'group/'+(uid==im.mine.uid ? 'rename' : 'remark')+'/'+gid">
							<span class="pop__detail-item-left">
								{{uid==im.mine.uid ? $lang('群聊名称') : $lang('备注名称')}}
							</span>
							<span class="pop__detail-section pop__flex1" v-html="uid==im.mine.uid ? groupname : remark || groupname"></span>
							<div class="pop__arr"></div>
						</div>
					</li>
					<li v-if="im.setting.qrcode_group=='on'">
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'group/qrcode/'+gid">
							<span class="pop__detail-item-left">{{$lang('群二维码')}}</span>
							<span class="pop__detail-section pop__flex1 pop__icon">&#xeba0;</span>
							<div class="pop__arr"></div>
						</div>
					</li>
					<li v-show="uid == im.mine.uid || is_manager">
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell">
							<span class="pop__flex1">{{$lang('全员禁言')}}</span>
							<div class="pop__input-block">
								<input type="checkbox" v-model="forbid_speaking">
								<div class="pop__unselect pop__form-switch" :class="{'pop__form-onswitch':forbid_speaking==1}" @click="toggleForbidSpeaking()">
									<em>{{forbid_speaking==1 ? 'ON' : 'OFF'}}</em><i></i>
								</div>
							</div>
						</div>
					</li>

					<li v-show="uid == im.mine.uid || is_manager">
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'group/notice/'+gid">
							<span class="pop__detail-item-left">{{$lang('编辑公告')}}</span>
							<span class="pop__detail-section pop__flex1 pop__icon pop__arr"></span>
						</div>
					</li>
				</ul>
			</div>
			<div class="pop__btns-panel">
				<a v-if="uid!=im.mine.uid" class="pop__btn-warning" href="javascript:;" @click="leaveGroup">{{$lang('删除群组')}}</a>
				<a v-if="uid==im.mine.uid" class="pop__btn-warning" href="javascript:;" @click="deleteGroup">{{$lang('解散群组')}}</a>
			</div>
		</div>
	</div>

	<!-- 群组成员 -->
	<div class="pop__panel pop__clearfix" id="group_members" style="display: none;" v-show="im.show=='group_members'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('群成员')}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>

			<!-- //群详细资料页 -->
			<div class="pop__detail-panel">
				<ul class="pop__clearfix">
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-wrap pop__flex-align-center pop__cell">
							<template v-for="item in members">
								<div class="pop__avatar" :routeUrl="avatarLink(item.uid)" :key="item.uid"><img :src="item.avatar"/><span v-html="item.remark||item.nickname"></span></div>
							</template>
							<div class="pop__more-item pop__flex1 pop__flexbox pop__flex-align-center pop__flex-justify-center pop__cell" @click="nextPage">
								<div class="pop__more">
									<span>
										{{!ended?$lang('加载更多'):$lang('没有更多数据了')}}
									</span>
									<span class="pop__arr" v-show="!ended&&!im.dataLoading"></span>
									<i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>
								</div>
							</div>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</div>

	<!-- 群组公告 -->
	<div class="pop__panel pop__clearfix" id="group_notice" style="display: none;" v-show="im.show=='group_notice'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('编辑公告')}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>
			<div class="pop__center pop__qrcode">
				<div class="pop__group-notice-edit-box">
					<textarea v-html="notice" class="pop__group-notice-textarea" v-model="notice">
					</textarea>
					<div class="pop__flexbox pop__flex-justify-center pop__margin-top">
						<a class="pop__btn-primary" @click="save">{{$lang('保存并发布')}}</a>
					</div>
				</div>
			</div>
		</div>
	</div>

	<!-- 好友申请详情 -->
	<div class="pop__panel pop__clearfix" id="apply_detail" style="display: none;" v-show="im.show=='apply_detail'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('详细资料')}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>

			<div class="pop__detail-panel">
				<ul class="pop__clearfix">
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell">
							<img class="pop__avatar" :src="avatar" />
							<label class="pop__detail-item-left pop__flex1">
								<em v-html="nickname"></em><i v-html="username"></i>
							</label>
						</div>
					</li>
					<li>
						<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell">
							<label class="pop__detail-item-left">{{$lang('附言')}}:</label>
							<div class="pop__detail-item-right" v-html="postScript"></div>
						</div>
					</li>
				</ul>
			</div>
			<div class="pop__btns-panel">
				<a class="pop__btn-primary" href="javascript:;" v-if="operation=='not_operated'" @click="agree">{{$lang('同意申请')}}</a>
				<a class="pop__btn-default" href="javascript:;" v-if="operation=='not_operated'" @click="refuse">{{$lang('拒绝申请')}}</a>
			</div>

		</div>
	</div>

	<!-- 登录页面 -->
	<div class="pop__panel pop__clearfix" id="login" style="display:none;" v-show="im.show=='login'">
		<div class="pop__form-cells">
			<h2 class="pop__form-title">{{$lang('欢迎登录')}} {{im.setting.app_name}}</h2>
			<form action="post" @keyup.13="login">
				<div class="pop__form-cell">
					<div><label class="pop__form-label">{{$lang('用户名')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" name="username" v-model="username" type="text" :placeholder="$lang('输入用户名')">
					</div>
				</div>
				<div class="pop__form-cell">
					<div><label class="pop__form-label">{{$lang('密码')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" name="password" v-model="password" type="password" :placeholder="$lang('输入密码')">
					</div>
				</div>
				<div class="pop__form-cell" v-if="im.setting.login_captcha=='on'">
					<div ><label class="pop__form-label">{{$lang('验证码')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" type="text" v-model="captcha" :placeholder="$lang('输入验证码')">
					</div>
					<div>
						<img class="pop__form-captcha" :src="im.api.loginCaptcha" @click="switchCaptcha" ref="captchaImg">
					</div>
				</div>
				<div class="pop__form-link" v-show="im.setting.register=='on'"><a :href="im.baseUri+'user/join'">{{$lang('注册账号')}}</a></div>
				<div class="pop__form-btn"><a class="pop__btn-primary btn__login" @click="login" href="javascript:;">{{$lang('登录')}}</a></div>

			</form>
			<div class="pop__switch-lang" :routeUrl="im.baseUri+'setting/language'">{{$lang('切换语言')}}</div>
		</div>

	</div>

	<!-- 注册页面 -->
	<div class="pop__panel pop__clearfix" id="join" style="display:none;" v-show="im.show=='join'">
		<div class="pop__form-cells">
			<h2 class="pop__form-title">{{$lang('欢迎注册')}} {{im.setting.app_name}}</h2>
			<form action="post" @keyup.13="join">
				<div class="pop__form-cell">
					<div><label class="pop__form-label">{{$lang('用户名')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" name="username" v-model="username" type="text" :placeholder="$lang('输入用户名')">
					</div>
				</div>
				<div class="pop__form-cell">
					<div><label class="pop__form-label">{{$lang('密码')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" name="password" v-model="password" type="password" :placeholder="$lang('输入密码')">
					</div>
				</div>
				<div class="pop__form-cell">
					<div><label class="pop__form-label">{{$lang('昵称')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" name="nickname" v-model="nickname" type="text" :placeholder="$lang('输入昵称')">
					</div>
				</div>
				<div class="pop__form-cell">
					<div><label class="pop__form-label">{{$lang('个性签名')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" name="sign" v-model="sign" type="text" :placeholder="$lang('个性签名')">
					</div>
				</div>
				<div class="pop__form-cell" v-if="im.setting.register_captcha == 'on'">
					<div ><label class="pop__form-label">{{$lang('验证码')}}</label></div>
					<div class="pop__flex1">
						<input class="pop__form-input" type="text" v-model="captcha" :placeholder="$lang('输入验证码')">
					</div>
					<div>
						<img class="pop__form-captcha" :src="im.api.joinCaptcha" @click="switchCaptcha" ref="captchaImg">
					</div>
				</div>
				<div class="pop__form-link"><a :href="im.baseUri+'user/login'">{{$lang('已有账号，点击这里登录')}}</a></div>
				<div class="pop__form-btn"><a class="pop__btn-primary btn__login" @click="join" href="javascript:;">{{$lang('提交')}}</a></div>
			</form>
			<div class="pop__switch-lang" :routeUrl="im.baseUri+'setting/language'">{{$lang('切换语言')}}</div>
		</div>

	</div>

	<!-- 加好友发送附言，设置备注等 -->
	<div class="pop__panel pop__clearfix" id="setting" style="display: none;" v-show="im.show=='setting'">
		<div class="pop__header">
			<div class="pop__header-wrapper pop__flexbox">
				<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
				<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang(title)}}</h2>
				<em class="pop__confirm-button">
				<a href="javascript:;" class="pop__btn-primary-mini" @click="action">{{$lang('确定')}}</a>
				</em>
			</div>
		</div>
		<div class="pop__main-page pop__flexbox">
			<div class="pop__flex1">
				<div class="pop__gray-text" v-html="$lang(desc)"></div>
				<ul class="pop__clearfix">
					<li><label class="pop__flexbox"><input class="pop__input pop__flex1" type="text" v-model="content" /></label></li>
				</ul>
			</div>
		</div>
	</div>

	<!-- 添加朋友 -->
	<div class="pop__panel pop__clearfix" id="search" style="display: none;" v-show="im.show=='search'">
		<div class="pop__header">
			<div class="pop__header-wrapper pop__flexbox">
				<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
				<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('添加朋友')}}</h2>
				<em class="pop__placeholder"></em>
			</div>
		</div>
		<div class="pop__scrolling-panel">
			<div class="pop__friend-list">
				<ul class="pop__clearfix">
					<li>
						<div class="pop__search-bar" :class="{'pop__search-bar-focusing':!showApplyList}">
							<div class="pop__search-bar-form">
								<div class="pop__search-bar-box">
									<i class="pop__icon-search"></i>
									<input type="text" class="pop__search-bar-input" :pop__placeholder="$lang('请输入对方账号')" v-model="searchText" required="" @blur="blur" ref="input"/>
									<a href="javascript:" class="pop__icon-clear" @click="clear"></a>
								</div>
								<label class="pop__search-bar-label" @click="focus">
									<i class="pop__icon-search"></i>
									<span>{{$lang('请输入对方账号')}}</span>
								</label>
							</div>
							<a href="javascript:" class="pop__search-bar-cancel-btn" @click="cancel">{{$lang('取消')}}</a>
						</div>
					</li>
					<li v-show="showApplyList">
						<template  v-for="item in applyList">
							<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'apply/detail/'+item.nid">
								<img class="pop__avatar-small" :src="item.avatar"><span class="pop__flex1" v-html="item.nickname"></span><span class="pop__friend-list-operation" v-html="operationName(item.operation)"></span>
							</div>
						</template>
					</li>
					<li v-show="!showApplyList&&searchText">
						<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" @click="search">
							<img class="pop__avatar-small" src="/static/h5/img/search-text.png"><span class="pop__flex1"><b>{{$lang('搜索')}}</b>：<span class="pop__green">{{searchText}}</span></span>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</div>

	<!-- 群成员操作 -->
	<div class="pop__panel pop__clearfix" id="group_member_operation" style="display: none;" v-show="im.show=='group_member_operation'">
		<div class="pop__header">
			<div class="pop__header-wrapper pop__flexbox">
				<a class="pop__header-back" href="javascript:;" @click="hide"></a>
				<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('选择联系人')}}</h2>
				<em class="pop__confirm-button-fixed">
					<button class="pop__btn-primary-mini" :disabled="!selectedItems.length" @click="action">{{$lang('完成')}}{{selectedItems.length ? '('+selectedItems.length+')' : ''}}</button>
				</em>
			</div>
		</div>
		<div class="pop__body">
			<div class="pop__scrolling-panel">
				<div class="pop__friend-list">
					<ul class="pop__clearfix pop__cells_checkbox">
						<li>
							<form ref="form">
							<template v-for="(items,key) in members">
								<h2 class="pop__friend-list-letter pop__border-top" :class="'pop__firend_list_'+key||'other'">{{key||'#'}}</h2>
								<template v-for="item in items">
									<label class="pop__row pop__flexbox pop__flex-align-center pop__cell pop__check-label">
										<input type="checkbox" class="pop__check" v-model="selectedItems" :value="item.uid">
										<i class="pop__icon-checked"></i>
										<img class="pop__avatar-small" :src="item.avatar"><span class="pop__clamp1 pop__flex1" v-html="item.name||item.remark||item.nickname"></span>
									</label>
								</template>
							</template>
							</form>
						</li>
					</ul>
				</div>
			</div>
			<!-- //字母显示 -->
			<div class="pop__friend-list-showletter">A</div>
			<!-- //26字母 -->
			<div class="pop__friend-list-floatletter">
				<em v-for="char in ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','#']" @click="scrollIntoView(char)">{{char}}</em>
			</div>
		</div>

	</div>

	<!-- 群内禁言 -->
	<div class="pop__panel pop__clearfix" id="forbidden" style="display: none;" v-show="im.show=='forbidden'">
		<div class="pop__header">
			<div class="pop__header-wrapper pop__flexbox">
				<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
				<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i> </h2>
				<em class="pop__confirm-button">
				<button class="pop__btn-primary-mini" @click="action" :disabled="!selectedValue">{{$lang('完成')}}</button>
				</em>
			</div>
		</div>

		<div class="pop__scrolling-panel">
			<div class="pop__friend-list">
				<ul class="pop__clearfix pop__cells_checkbox">
					<li>
						<form ref="form">
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="-1">
								<i class="pop__icon-checked"></i>{{$lang('解除禁言')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="600">
								<i class="pop__icon-checked"></i>10{{$lang('分钟')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="3600">
								<i class="pop__icon-checked"></i>1{{$lang('小时')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="43200">
								<i class="pop__icon-checked"></i>12{{$lang('小时 ')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="86400">
								<i class="pop__icon-checked"></i>1{{$lang('天')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="259200">
								<i class="pop__icon-checked"></i>3{{$lang('天 ')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="604800">
								<i class="pop__icon-checked"></i>7{{$lang('天 ')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="1296000">
								<i class="pop__icon-checked"></i>15{{$lang('天 ')}}
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="2592000">
								<i class="pop__icon-checked"></i>30{{$lang('天 ')}}
							</label>
						</form>
					</li>
				</ul>
			</div>
		</div>

	</div>


	<!-- 设置语言 -->
	<div class="pop__panel pop__clearfix" id="language" style="display: none;" v-show="im.show=='language'">
		<div class="pop__header">
			<div class="pop__header-wrapper pop__flexbox">
				<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
				<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i></h2>
				<em class="pop__confirm-button">
					<button class="pop__btn-primary-mini" @click="action" :disabled="!selectedValue">{{$lang('完成')}}</button>
				</em>
			</div>
		</div>

		<div class="pop__scrolling-panel">
			<div class="pop__friend-list">
				<ul class="pop__clearfix pop__cells_checkbox">
					<li>
						<form ref="form">
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="zh-CN" :checked="selectedValue=='zh-CN'">
								<i class="pop__icon-checked"></i>简体中文
							</label>
							<label class="pop__row pop__flexbox pop__check-label">
								<input type="radio" class="pop__check" v-model="selectedValue" value="en" :checked="selectedValue=='en'">
								<i class="pop__icon-checked"></i>English
							</label>

						</form>
					</li>
				</ul>
			</div>
		</div>

	</div>

	<!-- 头像设置 -->
	<div class="pop__panel pop__clearfix" id="set_avatar" style="display: none;" v-show="im.show=='set_avatar'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('头像')}}</h2>
					<a class="pop__dot-more"><form><input class="pop__input-choose-avatar" type="file" accept="image/*" @change="uploadAvatar" /></form></a>
				</div>
			</div>
			<div class="pop__center">
				<img class="pop__avatar" :src="im.mine.avatar">
			</div>
		</div>
	</div>

	<!-- 显示二维码 -->
	<div class="pop__panel pop__clearfix" id="qrcode" style="display: none;" v-show="im.show=='qrcode'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang(tips)}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>
			<div class="pop__center pop__qrcode">
				<div class="pop__qrcode-wrapper">
					<div class="pop__qrcode-info pop__flexbox">
						<img class="pop__avatar-mini" :src="avatar"/><span v-html="name"></span>
					</div>
					<div id="qrcode-img" class="pop__qrcode-img pop__flexbox"></div>
				</div>
			</div>
		</div>
	</div>

	<!-- 扫描二维码 -->
	<div class="pop__panel pop__clearfix" id="qrcode_scan" style="display: none;" v-show="im.show=='qrcode_scan'">
		<div class="pop__main-page pop__flexbox" >
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i></h2>
				</div>
			</div>
			<div class="pop__center" id="qrcode_scan_div">
			</div>
		</div>
	</div>

	<!-- 设置相关 -->
	<div class="pop__panel pop__clearfix" id="setting_others" style="display: none;" v-show="im.show=='setting_others'">
		<div class="pop__main-page pop__flexbox">
			<!-- //顶部 -->
			<div class="pop__header">
				<div class="pop__header-wrapper pop__flexbox">
					<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
					<h2 class="pop__header-title pop__flex1"><i v-show="im.dataLoading" class="pop__loading pop__loading-head"></i>{{$lang('设置')}}</h2>
					<em class="pop__placeholder"></em>
				</div>
			</div>

			<!-- //设置相关 -->
			<div class="pop__detail-panel">
				<ul class="pop__clearfix">
					<li>
						<div class="pop__detail-item pop__margin-top pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'setting/password'">
							<span class="pop__flex1">{{$lang('修改密码')}}</span><div class="pop__arr"></div>
						</div>
					</li>

					<li>
						<div class="pop__detail-item pop__margin-top pop__flexbox pop__flex-align-center pop__cell">
							<span class="pop__flex1">{{$lang('提示音')}}</span>
							<div class="pop__input-block">
								<input type="checkbox" v-model="prompt_tone">
								<div class="pop__unselect pop__form-switch" :class="{'pop__form-onswitch':im.mine.prompt_tone=='on'}" @click="togglePromptTone()">
									<em>{{im.mine.prompt_tone=='on' ? 'ON' : 'OFF'}}</em><i></i>
								</div>
							</div>
						</div>
					</li>

					<li>
						<div class="pop__detail-item pop__margin-top pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'setting/language'">
							<span class="pop__flex1">{{$lang('切换语言')}}</span><div class="pop__arr">{{languageName}}</div>
						</div>
					</li>

					<li>
						<div class="pop__detail-item pop__margin-top pop__text-center pop__input">
							<label class="pop__detail-item-left pop__flex1" @click="logout">{{$lang('退出')}}</label>
						</div>
					</li>
				</ul>
			</div>

		</div>
	</div>

	<!-- 更改密码 -->
	<div class="pop__panel pop__clearfix" id="password" style="display: none;" v-show="im.show=='password'">
		<div class="pop__header">
			<div class="pop__header-wrapper pop__flexbox">
				<a class="pop__header-back" href="javascript:;" onclick="history.back(-1);"></a>
				<h2 class="pop__header-title pop__flex1">{{$lang('修改密码')}}</h2>
				<em class="pop__confirm-button">
					<a href="javascript:;" class="pop__btn-primary-mini" @click="update">{{$lang('确定')}}</a>
				</em>
			</div>
		</div>
		<div class="pop__main-page pop__flexbox">
			<div>
				<div class="pop__gray-text">{{$lang('旧密码')}}</div>
				<ul class="pop__clearfix">
					<li><label class="pop__flexbox"><input class="pop__input pop__flex1" type="password" v-model="password_old" :placeholder="$lang('请输入旧密码')"/></label></li>
				</ul>
			</div>
			<div>
				<div class="pop__gray-text">{{$lang('新密码')}}</div>
				<ul class="pop__clearfix">
					<li><label class="pop__flexbox"><input class="pop__input pop__flex1" type="password" v-model="password1" :placeholder="$lang('请输入新密码')"/></label></li>
				</ul>
			</div>
			<div>
				<div class="pop__gray-text">{{$lang('确认新密码')}}</div>
				<ul class="pop__clearfix">
					<li><label class="pop__flexbox"><input class="pop__input pop__flex1" type="password" v-model="password2" :placeholder="$lang('请再次输入新密码')"/></label></li>
				</ul>
			</div>
		</div>
	</div>

	<!-- 提示框 -->
	<div class="pop__panel" id="dialog" style="display: none;" v-show="show">
		<div class="pop__mask"></div>
		<div class="pop__dialog">
			<div class="pop__dialog__bd">{{content}}</div>
			<div class="pop__dialog__ft">
				<a href="javascript:;" class="pop__dialog__btn pop__dialog__btn_primary" @click="show=false" v-show="!callback">{{$lang('知道了')}}</a>
				<a href="javascript:;" class="pop__dialog__btn pop__dialog__btn_default" @click="show=false" v-show="callback">{{$lang('取消')}}</a>
				<a href="javascript:;" class="pop__dialog__btn pop__dialog__btn_primary" @click.prevent="action" v-show="callback">{{$lang('确定')}}</a>
			</div>
		</div>
	</div>

	<!-- 操作提示 -->
	<div class="pop__panel" id="actionsheet">
		<div class="pop__mask" style="display:none;" v-show="show"></div>
		<div class="pop__actionsheet" :class="{'pop__actionsheet_toggle':show}">
			<div class="pop__actionsheet__title">
				<p class="pop__actionsheet__title-text" v-html="content"></p>
			</div>
			<div class="pop__actionsheet__menu">
				<div class="pop__actionsheet__cell" @click="action" :class="{'pop__indianred':warning}">{{$lang('确认')}}</div>
			</div>
			<div class="pop__actionsheet__action">
				<div class="pop__actionsheet__cell" @click="cancel">{{$lang('取消')}}</div>
			</div>
		</div>
	</div>

	<div class="pop__panel" id="toast" style="display: none;" v-show="dataPosting">
		<div class="pop__toast">
			<i class="pop__icon_toast" :class="{pop__loading:dataPosting==1, 'pop__icon-success-no-circle':dataPosting==2}"></i>
			<p class="pop__toast__content">{{dataPosting == 2?$lang('操作成功'):$lang('提交中...')}}</p>
		</div>
	</div>

	<script src="/static/h5/js/zepto.min.js"></script>
	<!--<script src="/static/h5/js/page.js"></script>-->
	<script src="/static/h5/js/page.min.js"></script>
	<!--<script src="/static/h5/js/vue.js"></script>-->
	<script src="/static/h5/js/vue.min.js"></script>
	<script src="/static/h5/js/linkify.min.js"></script>
	<script src="/static/h5/js/linkify-html.min.js"></script>
	<script src="/static/h5/js/fontSize.js"></script>
	<script src="/static/h5/js/subscriber.js?v=3.6.1"></script>
	<script src="/static/h5/js/pop_function.js?v=3.1.2"></script>
	<script src="/static/h5/js/h5.min.js?v=3.13"></script>

    <script>
        (function () {
            var src = '/static/h5/js/eruda.min.js';
            if (!/debug/.test(window.location) && localStorage.getItem('active-eruda') != 'true') return;
            document.write('<scr' + 'ipt src="' + src + '"></scr' + 'ipt>');
            document.write('<scr' + 'ipt>eruda.init();</scr' + 'ipt>');
        })();
		$(function(){
		    setTimeout(function(){
				(function () {
                    var js = document.createElement("script");
                    js.src = "/static/h5/js/swiper-3.4.1.min.js";
                    var s = document.getElementsByTagName("script")[0];
                    s.parentNode.insertBefore(js, s);
                })();
				(function () {
                    var style = document.createElement("link");
                    style.href = '/static/h5/css/swiper-3.4.1.min.css';
                    style.rel = 'stylesheet';
                    style.type = 'text/css';
                    var s = document.getElementsByTagName("link")[0];
                    s.parentNode.insertBefore(style, s);
                })();
				(function () {
                    var js = document.createElement("script");
                    js.src = "/static/h5/js/webrtc/recorder.js";
                    var s = document.getElementsByTagName("script")[0];
                    s.parentNode.insertBefore(js, s);
                })();
                (function () {
                    var js = document.createElement("script");
                    js.src = "/static/h5/js/qrcode.min.js";
                    var s = document.getElementsByTagName("script")[0];
                    s.parentNode.insertBefore(js, s);
                })();
			}, 100);
		});

	</script>
</body>
</html>
